import React, { useState } from 'react';
import 'antd/dist/antd.css'
import '../css/index.scss'
import { Button, Select, Form, Input, InputNumber, Radio, DatePicker, Table, Space, Cascader, Switch,message } from 'antd';
import axios from '../../../../../http/index'

export default function Add(props) {
    const onFinish = (values) => {
        console.log(values);
    };
    // 添加弹窗表单的内部内容分布
    const layout = {
        labelCol: { span: 4 },
        wrapperCol: { span: 20 },
    };
    // 添加弹窗警告提示
    const validateMessages = {
        required: '这是必填项哦',
        types: {
            email: '${label} is not a valid email!',
            number: '${label} is not a valid number!',
        },
        number: {
            range: '${label}必须大于${min}小于${max}',
        },

    };
    // 帮助正文
    const couponName = () => {

    }
    // 优惠券类型select下拉
    const { Option } = Select;
    const onGenderChange = (value) => {
        switch (value) {
            case '1':

                return;
            case '2':

                return;
            case '3':

                return;
            case '4':

                return;
        }
    };
    // 显示设置
    const [seedata,setseedata] = useState('1')
    const see = (e) => {
    if(e){
        setseedata('1')
    }else{
        setseedata('0')

    }
    }
    // 备注
    const introduction = e => {
        console.log(e.target.value);
    }

    // 提交
    const [form] = Form.useForm();
    const submits = async () => {
        try {
          const values = await form.validateFields();
          console.log('Success:', values);
          console.log('Success2:', seedata);
          axios({
            method: "GET",
            url: '/system/invitation/invitationmanagement/addHelpCenterEditing',
            params:{
                classification:values.gender,
                elpcenter_show:seedata,
                help_question_title:values.couponName,
                help_text:'',
                title:values.introduction,
            }
        })
            .then((res) => {
                console.log(res);
                props.close1()
                props.seedata()
                message.success('发布成功');
            })
            .catch((err) => {
                console.log(err);
                message.error('发布失败');
            })
        } catch (errorInfo) {
          console.log('Failed:', errorInfo);
        }
      };
    return (
        <div>
            <Form {...layout} name="nest-messages"
                onFinish={onFinish}
                validateMessages={validateMessages}
                initialValues={{
                    gender: '1',
                }}
                form={form}>
                <Form.Item name='couponName' label="帮助标题" rules={[{ required: true }]}>
                    <Input onBlur={couponName} placeholder="请输入帮助标题" />
                </Form.Item>
                <Form.Item
                    name="gender"
                    label="帮助分类"
                >
                    <Select
                        placeholder="请选择帮助分类"
                        onChange={onGenderChange}
                        allowClear
                    >
                        <Select.Option value="1">常见问题</Select.Option>
                        <Select.Option value="2">金融问题</Select.Option>
                        <Select.Option value="3">售后问题</Select.Option>
                    </Select>
                </Form.Item>

                <Form.Item name='see' label="显示设置" valuePropName="checked">
                    <Switch checkedChildren="是" unCheckedChildren="否" defaultChecked onChange={see} />
                </Form.Item>

                <Form.Item name='introduction' label="帮助正文" rules={[{ required: true }]}>
                    <Input.TextArea style={{ height: 100 }} onBlur={introduction} />
                </Form.Item>


                <Form.Item wrapperCol={{ ...layout.wrapperCol, offset: 8 }} >
                    <Button type="primary" htmlType="submit" onClick={submits}>
                        提交
                    </Button>
                </Form.Item>
            </Form>

        </div>
    )
}
